<div id="content" ng-controller="MyCtrl">
<div class="container-fluid">

	<div class="row-fluid">

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-info"></i></span>
			<h5>uiTip</h5>
		</div>
		<div class="widget-content">
			<input type="text" ng-model="tipTest" ui-tip="提示信息..." ui-tip-options="{alignX: 'right'}" ng-init="tipTest = 'Focus me';" />
			<br />
			<span ui-tip="提示信息！" ui-tip-options="{showOn: 'mouseenter'}">Hover me</span>
			<br />
			<button class="btn" ng-click="showAlert();">Alert</button>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-time"></i></span>
			<h5>uiDate</h5>
		</div>
		<div class="widget-content">
			<span>
				<input type="text" ng-model="handleTimeBegin" 
					ui-date="{dateFormat: 'yy-mm-dd', timeFormat: '23:59:59', changeMonth: true, changeYear: true, showOtherMonths: true, showHour: false, showMinute: false}" 
					ui-valid="datetime" />
			</span>
			&nbsp;-&nbsp;
			<span>
				<input type="text" ng-model="handleTimeEnd" 
					ui-date="{dateFormat: 'yy-mm-dd 23:59', changeMonth: true, changeYear: true, showButtonPanel: true}" 
					ui-valid-tips="止期比起期范围在7天内！"
					ui-valid="datetime date:rangeout:handleTimeBegin:+0 date:range:handleTimeBegin:+7" />
			</span>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-list"></i></span>
			<h5>uiDropdown</h5>
		</div>
		<div class="widget-content">
			<input type="text" ng-model="dropdownTest" ng-disabled="isGray" ui-valid="r" 
				ui-editable="true" 
				ui-dropdown="{editable: true, valueField: 'code', labelField: 'label', list: 'list', blankLabel: '--/--', heightStep: 10}" />
			<br />
			{{dropdownTest}}

			<br />

			<input type="text" style="width: 300px;" ng-model="dropdownTest2" ng-disabled="isGray" ui-valid="r" 
				ui-dropdown="{valueField: 'code', labelField: 'label', queryUrl: '/ctrl/Test/getList.gy', blankLabel: '--/--'}" />
			<br />
			{{dropdownTest2}}

			<br />
			
			<span style="display: inline-blick; width: 600px;">
			<input type="text" ng-model="dropdownTest3" ng-disabled="isGray" ui-valid="r" 
				ui-dropdown="{valueField: 'code', labelField: 'label', list: 'list', multiple: true, blankLabel: '--/--'}" />
			</span>
			<br />
			{{dropdownTest3}}

			<br />
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-folder-open"></i></span>
			<h5>uiDialog</h5>
		</div>
		<div class="widget-content">
			<button class="btn" ng-click="openDialog();">Open</button>

			<script type="text/x-template" 
				ui-dialog="{showModel: 'ctrl.isDialogShowInner', title: 'title inner', dialogId: 'dialogB', lock: true, fixed: true, ext: {max: false}}">
				inner content
				<br />
				<button class="btn" ng-click="ctrl.isDialogShowInner = false">Close inner</button>
			</script>
			<script type="text/x-template" 
				ui-dialog2="{showModel: 'ctrl.isDialogShow', titleModel: 'dialogTitle', dialogId: 'dialogA', lock: true, fixed: true, closeFn: 'fnClosed', closeForce: true, ext: {min: false}}">
				<ul>
					<li ng-repeat="one in testLl">
					{{one}}
					</li>
				</ul>
				<br />
				<button class="btn" ng-click="ctrl.isDialogShowInner = true">Open inner</button>
			</script>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-desktop"></i></span>
			<h5>uiTabs</h5>
		</div>
		<div class="widget-content">
			<ul class="nav nav-tabs" ui-tabs="{targetIndex: 1, beforeFn: 'beforeFn'}"> 
				<li class="active"><a>Tab1</a></li> 
				<li><a>Tab2</a></li> 
			</ul>
			<div class="tabs active"> 
				<p>Raw denim you probably haven't heard of them jean shorts Austin.</p> 
			</div> 
			<div class="tabs" is-link="noRepeat">
				<script type="text/x-template">
				<span>
				{{tab2val}}
				</span>
				</script>
			</div>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-arrow-right"></i></span>
			<h5>uiPagi</h5>
		</div>
		<div class="widget-content">
			<ul>
				<li ng-repeat="one in currentPageLl">
					{{one.name}}
				</li>
			</ul>
			<div style="margin-top: 6px;" ui-pagi="" 
				pager="queryPager" on-change-page="changePage(cp, event)"></div>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-upload"></i></span>
			<h5>uploadify</h5>
		</div>
		<div class="widget-content">
			<span id="queue"></span>
			<span id="btn-upload"
				ext-uploadify="{uploader: 'ctrl/Test/upload.gym', multi: true, queueID: 'queue', paramsModel: 'test', fnSuccess: 'uploadSuccess'}"></span>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-list"></i></span>
			<h5>filter list</h5>
		</div>
		<div class="widget-content">
			<div ext-filter-grid="{fn: 'gridClick', filter: 'name', tblId: 'tblTest', styleNew: true}" 
				columns="columns" list="list4filter"></div>
			Form $valid : {{gridForm0.$valid}}
			<br />
			<button class="btn" ng-click="next()">Next</button>
		</div>
	</div>

	<div class="widget-box">
		<div class="widget-title"> 
			<span class="icon"><i class="icon-folder-open"></i></span>
			<h5>tree</h5>
		</div>
		<div class="widget-content">
			<div ext-tree="{fn: 'treeClick', choose: true, columns: 'columns4tree', styleNew: true}" list="list4tree"></div>
			<div ext-tree="{fn: 'treeClick', choose: true, styleNew: true}" list="list4tree2"></div>
		</div>
	</div>

	</div><!-- /.row-fluid -->

</div>
</div>